<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<style>
			div{
				width: 300px;
				height: 300px;
				background-color: white;
			}
		</style>
	</head>
	<body>
		<input type="button" value="设置边框" id="btnOne"/>
		<input type="button" value="设置文本" id="btnTwo" />
		<div></div>
		<div></div>
		<div></div>
		
	</body>
	<script type="text/javascript">
		//入口函数
		window.onload = function(){
			//1.先获取对应的元素
			var btnOne = document.getElementById("btnOne");
			var btnTwo = document.getElementById("btnTwo");
			var divs = document.getElementsByTagName("div");
			//给按钮设置点击事件
			btnOne.onclick = function(){
				for(var i = 0;i <divs.length;i++){
					divs[i].style.border = "1px solid red";
				}
			}
			btnTwo.onclick = function(){
				for(var i=0;i<divs.length;i++){
					divs[i].textContent = "我是设置的文本";
				}
			}
		}
//		window.onload = function(){
//			
//		}
		/*
		 * 分析原生js的缺点：
		 * 1.不能添加多个入口函数，添加多个，后面的将会把前面的覆盖。
		 * 2.原生js的api名太长。
		 * 3.原生js代码容易冗余
		 * 4.原生js中有些属性或方法有浏览器兼容问题。、
		 * 5.原生js容错率比较低
		 */
	</script>
</html>
